.heart-box {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50vh;
    /* 使容器占满整个视口高度 */

}

button {
    margin: 0 auto;
}

#heart-img {
    width: 200px;
    /* 初始不应用动画，通过JS控制 */
    animation: beat 1s infinite alternate;
    /* 默认暂停状态 */
    animation-play-state: paused;
}

#heart-img2 {
    width: 200px;
    /* 初始不应用动画，通过JS控制 */
    animation: zoom 1s infinite alternate;
    /* 默认暂停状态 */
    animation-play-state: paused;
    transition: transfrom 0.5s ease;
}

@keyframes beat {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-20px);
    }
}

@keyframes zoom {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.2);
    }
}